<%--
  Created by IntelliJ IDEA.
  User: lzy
  Date: 2018/8/22
  Time: 12:29
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>upload</title>
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.2.0.js"></script>
    <script type="text/javascript">
        $(function () {
            var i = 2;
            // 1.获取addFile,并为其添加click响应的函数
            $("#addFile").click(function () {
                ($(this).parent()).parent().before("<tr class='file'><td>File"
                    + i + ":</td><td><input type='file' name='file"
                    + i + "'></td></tr>\n" +
                    "<tr class='desc'><td>Desc"
                    + i + ":</td><td><input type='text' name='desc"
                    + i + "'><button id='delete"
                    + i + "' type='button'>删除</button></td></tr>");
                i++;

                // 获取新添加的删除按钮
                $("#delete" + (i - 1)).click(function () {
                    var $tr = $(this).parent().parent();
                    $tr.prev("tr").remove();
                    $tr.remove();
                    // 对i重新排序
                    $(".file").each(function (index) {
                        var n = index + 1;
                        $(this).find("td:first").text("File" + n);
                        $(this).find("td:last input").attr("name", "file" + n);
                    });

                    $(".desc").each(function (index) {
                        var n = index + 1;
                        $(this).find("td:first").text("Desc" + n);
                        $(this).find("td:last input").attr("name", "desc" + n);
                    });

                    i = i - 1;
                });
            });
        });
    </script>
</head>
<body>
<h4>上传文件</h4>
<font color="red">${requestScope.message}</font>
<br/><br/>
<form action="${pageContext.request.contextPath}/upload/up?method=upload" method="post" enctype="multipart/form-data">
    <input type="hidden" name="fileNum" id="fileNum" value="1">

    <table>
        <tr class="file">
            <td>File1:</td>
            <td>
                <input type="file" name="file1">
            </td>
        </tr>
        <tr class="desc">
            <td>Desc1:</td>
            <td>
                <input type="text" name="desc1">
            </td>
        </tr>
        <tr>
            <td>
                <input type="submit" id="submit" value="提交">
            </td>
            <td>
                <button id="addFile" type="button">新增一个附件</button>
            </td>
        </tr>
    </table>
</form>
</body>
</html>
